<template>
  <div id="wrap">
    <el-table class="box" :data="goodsList" border style="width: 100%">
      <el-table-column label="行号" width="60">
        <template slot-scope="scope">{{ scope.$index + 1 }}</template>
      </el-table-column>
      <el-table-column prop="status" label="状态" width="60">
        <template slot-scope="scope">
          <span>
            {{
            scope.row.status == 0
            ? "已驳回"
            : scope.row.status == 1
            ? "已通过"
            : "待审核"
            }}
          </span>
        </template>
      </el-table-column>
      <el-table-column prop="documentNum" label="单据编号"></el-table-column>
      <el-table-column prop="createDate" label="创单时间"></el-table-column>
      <el-table-column prop="category" label="商品类别"></el-table-column>
      <el-table-column prop="vendor" label="供应商"></el-table-column>
      <el-table-column prop="inboundStore" label="入库门店"></el-table-column>
      <el-table-column prop="inboundcounter" label="柜台/类库名称" width="100"></el-table-column>
      <el-table-column prop="orderNumber" label="订单号"></el-table-column>
      <el-table-column prop="count" label="数量"></el-table-column>
      <el-table-column prop="totalWeight" label="重量"></el-table-column>
      <el-table-column prop="totalPrice" label="成本"></el-table-column>
      <el-table-column prop="series" label="系数"></el-table-column>
      <el-table-column prop="LabelTotalPrice" label="标签金额"></el-table-column>
      <el-table-column prop="source" label="来源"></el-table-column>
      <el-table-column prop="createPerson" label="创单人"></el-table-column>
      <el-table-column prop="approver" label="审批人"></el-table-column>
      <el-table-column prop="approvalDate" label="审批日期"></el-table-column>
      <el-table-column style="text-align: center" label="操作" width="300">
        <template slot-scope="scope">
          <el-button
            class="changeBtn"
            @click="handleClick(scope.row, true)"
            type="primary"
            size="small"
            v-if="scope.row.status != '0'"
            :disabled="scope.row.status == '1'"
          >通过</el-button>
          <el-button
            class="changeBtn"
            @click="handleClick(scope.row, false)"
            type="primary"
            size="small"
            v-if="scope.row.status != '1'"
          >
            {{
            scope.row.status == "0"
            ? "撤销驳回"
            : scope.row.status == "2"
            ? "驳回"
            : ""
            }}
          </el-button>
          <el-button
            @click="delGoodsInfo(scope.row)"
            class="changeBtn"
            type="danger"
            size="small"
          >快捷出库</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: "GoodsInbounchList",
  props: ["goodsList", "status"],
  data() {
    return {};
  },
  created() {},
  watch: {},
  computed: {},
  methods: {
    // 操作按钮
    handleClick(item, flag) {
      // 已通过,状态为1
      if (item.status === "1") return;
      // 待审批（通过/驳回）和 已驳回
      if (flag) {
        // 点击通过按钮
        item.status = "1";
      } else {
        // 状态为已驳回时按钮为撤销驳回，修改其状态为 2（待审批），反之修改其状态为 0（已驳回）
        item.status = item.status == "0" ? "2" : "0";
      }
      item.approver = localStorage.getItem("username");
      this.$emit("modifyData", item);
    },
    // 出件
    delGoodsInfo(item) {
      this.$emit("delGoodsInfo", item.id);
    }
  }
};
</script>

<style lang="scss">
.box {
  font-size: 12px;
  .changeBtn {
    width: 80px;
    padding: 10px 0;
  }
}
.el-table .el-table__cell {
  text-align: center;
}
.page {
  margin-top: 20px;
  height: 30px;
  vertical-align: middle;
  .select {
    float: left;
    height: 28px;
    .el-select .el-input__inner {
      height: 28px;
      width: 40px;
    }
    .el-select .el-input .el-select__caret {
      height: 0;
      width: 0;
    }
    .el-icon-arrow-up:before {
      content: "";
    }
    .el-select .el-input__inner {
      padding: 0;
      text-align: center;
      margin: 0 4px;
    }
  }
  .pageList {
    float: right;
    margin-right: 5px;
  }
}
</style>